<!DOCTYPE HTML> 
<html>
<head>
    <title>我的朋友圈</title>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <link href="/resource/myfriend/css/style.css" rel="stylesheet">
    <script src="/resource/myfriend/js/zepto.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <!-- <script src="/resource/myfriend/js/weixin.js"></script> -->
</head>
<body>
    <header>
        <img id="bg" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/bg.jpg">
        <p id="user-name" class="data-name"></p>
        <img id="avt" class="data-avt" src="">
    </header>
    <div id="main">
        <div id="list">
        </div>
        <div id="share">
            <a href="http://www.youzigouwu.com/homepage/wxmyfriend">我也要装逼</a><a class="share">惊呆小伙伴</a>
            <p>（此朋友圈纯属虚构）</p>
        </div>
        <div id="guide" class="hide"></div>
    </div>
    <script id="man" type="text/template">
        <ul>
            
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/a1.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">苍井空</p>
                        <p class="post">想和男朋友一起区看电影，大家有什么好的男朋友推荐吗？~<img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c1.jpg"></p>
                        <p class="time">2分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">陈赫，叫兽易小星，王思聪，陈冠希，余文乐...</div>
                        <div class="cmt-list">
                        <p><span>张柏芝：</span><b class="data-name"></b></p>
                        <p><span>波多野结衣：</span><b class="data-name"></b></p>
                        <p><span>泷泽萝拉：</span><b class="data-name"></b></p>
                        <p><span class="data-name"></span><span>：</span>？</p>
                        </div>
                    </div>
                </div>
            </li>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/a2.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">鹿晗</p>
                        <div class="post"><p>明明可以靠脸吃饭，偏偏唱歌还那么好，<b class="data-name"></b>我们决赛见。#PPTV一唱成名#</p><img class="list-img" src="/resource/myfriend/images/pic.jpg"><img class="data-avt list-img" src=""></div>
                        <p class="time">2分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">蔡康永，李代沫，黄耀明，陈坤，毛宁，何炅...</div>
                        <div class="cmt-list">
                        <p><span>张柏芝：</span>靓崽噶～</p>
                        <p><span>波多野结衣：</span>今夜は暇ですか</p>
                        <p><span class="data-name"></span><span>：</span>谢谢老师</p>
                        <p><span>鹿晗</span>回复<span class="data-name"></span><span>：</span>加油，我看好你。</p>
                        </div>
                    </div>
                </div>
            </li>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt data-avt" src="">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name"><span class="data-name"></span></p>
                        <p class="post">你朋友圈最好玩的人是？</p>
                        <p class="time">刚刚</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">鹿晗，吴亦凡，李易峰，陈伟霆</div>
                        <div class="cmt-list">
                        <p><span>鹿晗：</span>是我~</p>
                        <p><span>吴亦凡：</span>是我</p>
                        <p><span>李易峰：</span>是我</p>
                        <p><span>陈伟霆：</span>是我</p>
                        </div>
                    </div>
                </div>
            </li>
        </ul>    
    </script>
    <script id="woman" type="text/template">
        <ul>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/n1.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">都敏俊</p>
                        <p class="post">大家好！请欢迎第二季《来自星星的你》的新女主角，<span class="data-name"></span><img class="data-avt" src=""></p>
                        <p class="time">刚刚</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">千颂伊 ，GEM，<span class="data-name"></span></div>
                        <div class="cmt-list">
                        <p><span>千颂伊：</span>欧巴，卡鸡嘛~</p>
                        <p><span class="data-name"></span><span>：</span>上面那位神烦，都不想想女主现在是谁。</p>
                        <p><span>都敏俊</span>回复<span class="data-name"></span><span>：</span>别说，吻我~</p>
                        </div>
                    </div>
                </div>
            </li>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/n2.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">鹿晗</p>
                        <p class="post"><span class="data-name"></span>，等了你1小时喽，还不到哇。不是说好一起看《我是证人》首映嘛！<img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/g1.jpg"></p>
                        <p class="time">2分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">TFBOYS-王俊凯，吴亦凡</div>
                        <div class="cmt-list">
                        <p><span class="data-name"></span><span>：</span>小公举在化妆</p>
                        <p><span>鹿晗</span>回复<span class="data-name"></span><span>：</span>小公举，我等你~</p>
                        </div>
                    </div>
                </div>
            </li>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/a5.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="ads">推广<img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/ads.png"></p>
                        <p class="po-name">快快租车</p>
                        <div class="post">邻居的悍马，你也可以租！
                            <p><a class="ad-link" href="http://www.kuaikuaizuche.com/activities/informationiflow/rentcar.html?ch=1002">查看详情 <img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/link.png"></a></p>
                            <img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c6.jpg"></div>
                        <p class="time">45分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">范冰冰，李晨，刘强东，...</div>
                        <div class="cmt-list">
                        <p><span>范冰冰：</span>新玩意？</p>
                        <p><span>李晨</span>回复<span>范冰冰 ：</span>你喜欢，我们可以试一下。</p>
                        </div>
                    </div>
                </div>
            </li>            
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/n3.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">TFBOYS-王俊凯</p>
                        <div class="post"><p>我！们！一！起！咬！ <b class="data-name"></b>！</p><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/g2.jpg"></div>
                        <p class="time">2分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">TFBOYS-王俊凯 ，鹿晗，TFBOYS-易烊千玺，TFBOYS-王源，...</div>
                        <div class="cmt-list">
                        <p><span class="data-name"></span><span>：</span>你们最近有听过小学生世纪大战吗？</p>
                        <p><span>鹿晗</span>回复<span class="data-name"></span><span>：</span>不知道，我只喜欢小公举你。</p>
                        <p><span>TFBOYS-王俊凯 </span>回复<span class="data-name"></span><span>：</span>不知道，我只喜欢小公举你。</p>
                        </div>
                    </div>
                </div>
            </li>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/n4.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">周杰伦</p>
                        <div class="post">
                            <p><b class="data-name"></b>，决战夜你要加油！我们哎哟不错战队是最屌的！</p>
                            <p><img class="list-img" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c2.jpg"><img class="data-avt list-img" src=""></p></div>
                        <p class="time">4分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">汪峰，那英，庾澄庆</div>
                        <div class="cmt-list">
                        <p><span class="data-name"></span><span>：</span>杰伦老师，决战夜小公举会来吗。</p>
                        <p><span>周杰伦</span>回复<span class="data-name"></span><span>：</span>你拿冠军了，我让你当小公举。</p>
                        </div>
                    </div>
                </div>
            </li>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/a6.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">刘强东</p>
                        <p class="post">最近专心调配奶茶，想把悍马分享出去<img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c7.jpg"></p>
                        <p class="time">50分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png"><span class="data-name"></span>，韩寒，郭敬明，叫兽易小星</div>
                        <div class="cmt-list">
                        <p><span>叫兽易小星：</span>我有段子</p>
                        <p><span>郭敬明：</span>我有童装</p>
                        <p><span class="data-name"></span><span>：</span>哥，我有草原，可以放野（悍）马。</p>
                        <p><span>刘强东</span>回复<span class="data-name"></span><span>：</span>就你了，今晚交车</p>
                        </div>
                    </div>
                </div>
            </li>
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/n5.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">王思聪</p>
                        <p class="post">我宣布，我和 <span class="data-name"></span> 结婚了！<img class="data-avt" src=""></p>
                        <p class="time">30分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="like"><img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/l.png">林更新，杨幂，anglebaby，范冰冰...</div>
                        <div class="cmt-list">
                        <p><span>林更新：</span>呵呵。</p>
                        <p><span class="data-name"></span><span>：</span>希望大家祝福我们！</p>
                        <p><span>王思聪</span>回复<span class="data-name"></span><span>：</span>我从此退出娱乐圈。</p>
                        </div>
                    </div>
                </div>
            </li>                
            <li>
                <div class="po-avt-wrap">
                    <img class="po-avt" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/a7.jpg">
                </div>
                <div class="po-cmt">
                    <div class="po-hd">
                        <p class="po-name">金星</p>
                        <p class="post">完美！<img src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c8.jpg"></p>
                        <p class="time">55分钟前</p><img class="c-icon" src="http://www.kuaikuaizuche.com/activities/pengyouquan/images/c.png">
                    </div>
                    <div class="r"></div>
                    <div class="cmt-wrap">
                        <div class="cmt-list">
                        <p><span class="data-name"></span><span>：</span>星姐，求虐！</p>
                        <p><span>金星</span>回复<span class="data-name"></span><span>：</span>你呢，人长的挺好看，就是偏偏要靠才华。</p>
                        </div>
                    </div>
                </div>
            </li>
        </ul>    
    </script>
    <script>
        $(function(){

            // $.getUrlParam = function(name) {
            //     var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            //     var r = window.location.search.substr(1).match(reg);
            //     if (r != null) return unescape(r[2]);
            //     return null;
            // };

            // var openid = $.getUrlParam("openid");

            // if(!openid){
            //     return location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx054fb4cc89cdc74b&redirect_uri=http%3A%2F%2Fwww.kuaikuaizuche.com%2FKkzc%2Factivity%2Fpengyouquan%2Fredirect.do&response_type=code&scope=snsapi_userinfo&state=STATE&connect_redirect=1#wechat_redirect";
            // }

            // $(document.body).show();
            // $.getJSON("/Kkzc/activity/pengyouquan/getUserInfo.do",{
            //     openid:openid
            // },function(res){
            //     if(res.code == 200){

                    var res = {
                        "data": {
                            "sex": <{if $userinfo.userGender=='f'}>2<{else}>1<{/if}>,
                            "nickname": "<{$userinfo.userName}>",
                            "headimgurl": "<{$userinfo.userIcon}>",
                            "config": {
                            }

                        }
                    }

                    wx.config({
                        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
			appId: '<{$SignPackage.appId}>',
			timestamp: '<{$SignPackage.timestamp}>',
			nonceStr: '<{$SignPackage.nonceStr}>',
			signature: '<{$SignPackage.signature}>',
                        jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "onMenuShareQQ", "onMenuShareWeibo", "closeWindow"]
                    });

                    var shareLink = "http://www.youzigouwu.com/homepage/wxmyfriend?openid=<{$userinfo.userOpenId}>"; // 分享链接
                    var shareTitle = "<{$userinfo.userName}>的朋友圈装逼指南"; // 分享标题
                    var shareDesc = ""; // 分享描述
                    var shareIcon = "<{$userinfo.userIcon}>"; // 分享图标


                    var sex = res.data.sex;
                    var nickname = res.data.nickname;
                    var headimgurl = res.data.headimgurl;

                    // if(sex == 2){
                    //     $("#list").html($("#woman").html());
                    // }
                    // else{
                        $("#list").html($("#man").html());
                    // }
                    setTimeout(function(){
                        $(".data-name").text(nickname);
                        $(".data-avt").attr("src",headimgurl);
                    },0);

                    $("#share .share").click(function(){
                        $("#guide").show();
                    }); 

                    $("#guide").click(function(){
                        $(this).hide();
                    });
                   
                    
                    wx.error(function(res) {
                        console.log(res);
                    });
                    wx.ready(function() {
                        wx.onMenuShareTimeline({
                            title: shareTitle, // 分享标题
                            link: shareLink, // 分享链接
                            imgUrl: shareIcon, // 分享图标
                            success: function() {},
                            cancel: function() {}
                        });
                        wx.onMenuShareAppMessage({
                            title: shareTitle, // 分享标题
                            desc: shareDesc, // 分享描述
                            link: shareLink, // 分享链接
                            imgUrl: shareIcon, // 分享图标
                            type: "link", // 分享类型,music、video或link，不填默认为link
                            dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
                            success: function() {},
                            cancel: function() {}
                        });
                        wx.onMenuShareQQ({
                            title: shareTitle, // 分享标题
                            desc: shareDesc, // 分享描述
                            link: shareLink, // 分享链接
                            imgUrl: shareIcon, // 分享图标
                            success: function() {},
                            cancel: function() {}
                        });
                        wx.onMenuShareWeibo({
                            title: shareTitle, // 分享标题
                            desc: shareDesc, // 分享描述
                            link: shareLink, // 分享链接
                            imgUrl: shareIcon, // 分享图标
                            success: function() {},
                            cancel: function() {}
                        });
                    });
            //     }
            // });

        });
    </script>

</body>
</html>
